<template>
  <div>
    <div class="main_content">
      <el-input
        style="width:200px;"
        clearable
        v-model="searchText"
        placeholder="请输入查询关键字"
        @keydown.enter.native="doSearch()"
      ></el-input>
      <el-button type="success" @click="doSearch()" class="added">搜索</el-button>
      <!-- <el-button style="margin-left:100px;" type="success" @click="toAdd()">新增</el-button> -->
      <!-- <el-button
        style="margin-left:10px;"
        type="danger"
        @click="handleMultiDelete"
        :disabled="!hasMultiDelete"
      >批量删除</el-button> -->
      <myTable
          style='margin-top:20px'
          height=300
          min-width='130'
          :myColumn=tableProp
          ahide='index,checkbox,mySplitPage,tooltip,background'
          slots='操作,100,right'
          @select='console'
          @header-click='console'
          @hook:created=' myTable.tableData = tableData '
          >
          <template slot-scope='button'>
              <el-button type="primary" size="mini" @click.stop="handleEdit(button.scope.$index, button.scope.row)">编 辑</el-button>
              <!-- <el-button type="info" size="mini" @click="doJinYong()">禁 用</el-button> -->
              <!-- <el-button type="success" size="mini" @click="doQiYong()">启 用</el-button> -->
          </template>
      </myTable>
      <!-- <el-table
        :data="tableData"
        border
        style="width: 100%;margin-top:10px;"
        :header-cell-style="tableHeaderStyle"
        @selection-change="handleSelectionChange"
        >
        <el-table-column type="selection" width="40" align="center"></el-table-column>
        <el-table-column prop="name" label="编号" align="center"></el-table-column>
        <el-table-column prop="name" label="姓名" align="center"></el-table-column>
        <el-table-column prop="date" label="账号" align="center"></el-table-column>
        <el-table-column prop="name" label="部门" align="center"></el-table-column>
        <el-table-column prop="date" label="岗位" align="center"></el-table-column>
        <el-table-column label="操作" align="center" width="140">
          <template slot-scope="scope">
            <el-button type="danger" size="mini" @click="handleDelete(scope.$switch, scope.row)">删除</el-button>
            <el-button type="primary" size="mini" @click="handleEdit(scope.$switch, scope.row)">编辑</el-button>
          </template>
        </el-table-column>
      </el-table>
      <div class="page">
        <el-pagination
          small
          @current-change="handleCurrentChange"
          :current-page.sync="currentPage"
          :page-size="thePageSize"
          layout="total, prev, pager, next, jumper"
          :total="myTotal"
        ></el-pagination>
      </div> -->

    </div>
  </div>
</template>
<script>
import myhttp, {
  isEmpty,
  msgError,
  msgSuccess,
  msgWarning
} from "../../utils/myhttp";
import qs from "qs";
import api from "../../utils/api";
export default {
  data() {
    return {
      loading: "",
      tableHeaderStyle: {
        //表头样式
        "background-color": "rgb(242,242,242)"
      },
      multipleSelection: [], //多选
      theRow: {}, //当前行数据
      theIndex: 0, //当前下标
      multiIDS: [], //多选
      theEdit: {}, //修改数据
      isEdit: false, //是否修改
      isDelete: false, //是否删除
      hasMultiDelete: false, //是否多选
      searchText: "", //搜索字段
      myTotal: 1, //分页总条数，默认1
      currentPage: 1, //初始化当前页
      nowPage: 1, //当前页
      thePageSize: 15, //每页条数
      tableData: [
        //表格数据
        {
          id: 1,
          date: "2016-05-02",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1518 弄"
        },
        {
          id: 2,
          date: "2016-05-04",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1517 弄"
        }
      ],
      tableProp: [
        { label: "编号", prop: "name" },
        { label: "姓名", prop: "name", html: '吼吼' },
        { label: "账号", prop: "payCode", html(newVal,row,index) {
            return '<i style=color:#F13400>' + ( newVal || '请付钱!!' )+ '</i>'
        } },
        { label: "部门", prop: "department", html: '呼呼' },
        { label: "岗位", prop: "position", html: '前端攻城狮' },
      ],
      rules: {
        //表单验证
        role_name: [
          { required: true, message: "请输入名称", trigger: "blur" },
          { min: 1, max: 25, message: "长度在 1 到 25 个字符", trigger: "blur" }
        ],
        resource: [
          { required: true, message: "请选择活动资源", trigger: "change" }
        ]
      }
    };
  },
  components: {},
  methods: {
    handleEdit(index, row) {
      // this.theAdd = row;
      // this.isAdd = true;
      this.$router.push({
        name: "limitEdit",
        // query: { inWarehouseId: responseData.data.inWarehouseId }
      });
    },
    doEdit: async function() {

    },
    doSearch() {
      //搜索方法
      this.getAllList();
    },
    handleSelectionChange(val) {
      //处理多选
      this.multipleSelection = val;
      this.multiIDS = val.map(element => element.id);
      this.hasMultiDelete = val.length !== 0;
    },
    handleCurrentChange(val) {
      //分页查询
      this.nowPage = val;
      this.getAllList();
    },
    goBack() {
      this.$router.go(-1);
    },
    openLoading() {
      //loading请求等待
      this.loading = this.$loading({
        lock: true,
        text: "Loading",
        spinner: "el-icon-loading",
        background: "rgba(0, 0, 0, 0.7)"
      });
    },
    getAllList: async function() {
    //   var postData = {
    //     in_warehouse_id: this.inWarehouseId,
    //     pageNum: this.nowPage,
    //     pageSize: this.thePageSize
    //   };
    //   var s = qs.stringify(postData);
    //   const responseData = await myhttp.post(api.selectInDetails, s);
    //   this.tableData = responseData.data.items;
    //   this.myTotal = responseData.data.total;
    //   if (responseData.data.result == "error") {
    //     msgError(this, responseData.data.msg);
    //   }
    }
  },
  created() {
    this.getAllList();
  },
  mounted() {}
};
</script>
<style scoped>
.active_crumb {
  color: rgb(90, 160, 230);
}
</style>


